<!--
 * @Author: tansq
 * @Date: 2021-07-22 15:50:52
 * @LastEditTime: 2022-09-29 11:09:41
 * @LastEditors: tansq
 * @Description: 导入表格组件
 * @FilePath: \hte-vue-dev\src\components\excelPaste\ExcelPaste.vue
 * 可以输入预定的版权声明、个性签名、空行等
-->
<template>

 <j-modal
    title="批量导入"
    width="80vw"
    :visible="excelVisible"
    switchFullscreen
    @cancel="handleCancelExcel"
    @ok="handleOkExcel"
    :maskClosable="false"
    :confirm-loading="excelConfirmLoading"
    cancelText="关闭"
    :afterClose="afterClose"
     @paste.native="pasteExcel"
  >
  <!-- <a-modal width="70vw"
    
      title="批量导入" :visible="excelVisible"
      :confirm-loading="excelConfirmLoading"
      @ok="handleOkExcel"
      @cancel="handleCancelExcel"
      @paste.native="pasteExcel"
      :afterClose="afterClose"
      :maskClosable="false"
    > -->
    <div style="min-height:50vh">
        <slot name="downLoadBtn">
          <a-button v-if="!downloadKey" style="margin-bottom:16px;    width: auto; " type="primary" icon="cloud-download" @click="downLoad" v-show="showBtu">下载模板</a-button>
          <commonAttachDownload v-else ref="downloader" :busKey="downloadKey"></commonAttachDownload>
        </slot>
        <span style="font-size:12px;color:red;margin-left:16px">(导入数据时单元格内容禁止按回车或者换行)</span>
      <a-table ref="tableExcel"   :pagination="excelPagination" :scroll="excelScroll" :loading="loading"
        size="middle" :columns="columnsExcel" :data-source="excelDataSource" bordered :locale="excelLocale">
  
       </a-table>
    </div>
      
    <!-- </a-modal> -->
    <!-- 使用例子
    <excel-paste :columnsExcel="columnsExcel" :exportXlsTemplateUrl="exportXlsTemplateUrl"  :excelVisible="excelVisible" :excelConfirmLoading="excelConfirmLoading"   @handleOkExcel="handleOkExcel" @handleCancelExcel="handleCancelExcel"></excel-paste>
				
	-->
 </j-modal>
</template>

<script>
import { pasteMixin } from '@/utils/pasteMixin'
import {downloadFile,downloadFileLink}  from '@/api/manage'

export default {
  name: 'ExcelPaste',
    mixins:[pasteMixin],
  components: {
    commonAttachDownload:()=> import('@/components/tools/commonAttachDownload'),
  },
  props:{
      //显示列
      columnsExcel:{
        type:Array,
        require:true
      },
      //确认加载
      excelConfirmLoading:{
        type:Boolean,
          default:false,
          require:true
      },
      //显示隐藏
      excelVisible:{
          type:Boolean,
          default:false,
          require:true
      },
      //分页
      excelPagination:{
          type:Boolean,
          default:false,
          require:false
      },
      //滚动
      excelScroll:{
          type:Object,
          default: () => { return  { x: '100%', y: '100%'}} ,
          require:false
      },
      //模板文件路径
      exportXlsTemplateUrl:{
        type:String,
        require:true
      },
       //模板请求路径
      exportXlsTemplateRequestUrl:{
        type:String,
        default:'/common/exportXlsTemplate',
        require:false
      },
       //是否清空数据
      clearData:{
        type:Boolean,
        default: true,
        require:false
      },
      showBtu:{
        type:Boolean,
        default: true,
        require:false
      },
      downloadKey:{
        //新导入模板下载
        default: '',
        require:false
      },
  },
  data() {
    return {
       loading:false,
    };
  },
  created(){
  },
  methods: {
      //关闭回调
      afterClose:function(){
          this.excelVisible = false
          this.excelConfirmLoading = false;
          if(this.clearData){
            this.excelDataSource = [];
          }
          
      },
      //模板下载
      downLoad:function(){
          
          let fileName =this.exportXlsTemplateUrl.substring(this.exportXlsTemplateUrl.lastIndexOf('/')+1,this.exportXlsTemplateUrl.length);
          downloadFileLink(this.exportXlsTemplateRequestUrl,fileName,{url:this.exportXlsTemplateUrl},{type: 'application/vnd.ms-excel'});
      }
  },
  computed:{
  },
  filters: {
  },
  watch:{
  },
  mounted(){

  }
 }
</script>


<style scoped>

</style>

